<template>
  <div class="contentAndfocus">
    <div class="header-btn" v-if="!clearBtn">
      <el-button type="primary" @click="save_fn" size="mini">保存</el-button>
      <el-button type="warning" @click="confirm_fn" size="mini">确认</el-button>
    </div>
    <el-table :data="tableData" size="mini" :header-cell-style="{background:'#F8F8F9'}"
              style="width: 100%" border :span-method="objectSpanMethod" ref="table"
    >
      <el-table-column label="审计阶段" prop="projectStage" align="center" :show-overflow-tooltip="true">
        <template slot-scope="scope">
          {{ scope.row.projectStage }}
          <div @click="add(scope.row)" v-if="!clearBtn">
            <el-icon
              class="el-icon-circle-plus-outline"
              style="cursor: pointer"
            ></el-icon>
          </div>
        </template>
      </el-table-column>
      <el-table-column label="复盘内容" prop="replayContent" align="center" :show-overflow-tooltip="true">
        <template slot-scope="scope">
          <el-input v-if="replayContentInputFlag && (!clearBtn)" size="mini" v-model="scope.row.replayContent"
          ></el-input>
          <span v-else>{{ scope.row.replayContent }}</span>
        </template>

      </el-table-column>
      <el-table-column label="风险点数量" prop="riskNum" align="center">
        <template slot-scope="scope">
          <el-input v-if="!clearBtn" v-model="scope.row.riskNum" size="mini"></el-input>
          <span v-else> {{ scope.row.riskNum }}</span>
        </template>

      </el-table-column>
      <el-table-column label="具体原因" prop="reason" align="center">
        <template slot-scope="scope">
          <el-input v-if="!clearBtn" v-model="scope.row.reason" size="mini"></el-input>
          <span v-else>{{ scope.row.reason }}</span>
        </template>

      </el-table-column>
      <el-table-column label="操作" align="center" width="100px">
        <template slot-scope="scope">
          <el-button v-if="!clearBtn" type="text" size="small" @click="delete_fn(scope.$index)">删除
          </el-button>
        </template>
      </el-table-column>

    </el-table>
  </div>
</template>

<script>
// import { queryProjectReplay, save, submit } from '@/api/businessAudit/projectAudit/completionPhase'
// import { delAuditMsg } from '@/api/publicApi'

export default {
  name: 'contentAndfocus',
  data() {
    return {
      tableData: [],
      replayContentInputFlag: false,
      clearBtn: false,
      replayId: '',
      //合并表格
      columnArr: ['', 'dotime', 'company_name'],
      spanArr: [], //临时组
      spanData: [], // 组合的合并组
      stageCount: {},
      rowIndexArr: []//存储合并单元格的开始位置
    }
  },
  created() {
    // this.projectId = this.$route.query.id
    this.getList()
  },
  methods: {
    getList() {

      this.tableData = [
            {
              'inputUser': 1966477,
              'updateUser': 1966477,
              'inputStamp': '2023-09-25 10:51:50',
              'updateStamp': '2023-09-25 10:51:50',
              'replayDetailId': '01hb5zf08j1f7m2bh74t0ybm82',
              'replayId': '8e358ae8c23a4e34b3f44d463e2b21d6',
              'projectId': 'f5f4066bd75a4e22946d65e53eda8673',
              'replayType': '内容与重点',
              'projectStage': '分析阶段',
              'replayContent': '未形成疑点事项',
              'riskNum': '0',
              'completionStatus': null,
              'reason': '哈哈哈哈',
              'orderNo': null
            },
            {
              'inputUser': 1966477,
              'updateUser': 1966477,
              'inputStamp': '2023-09-25 10:51:50',
              'updateStamp': '2023-09-25 10:51:50',
              'replayDetailId': '01hb5mmm08j1f7m2bh74t0ybm82',
              'replayId': '8e358ae8c23a4e34b3f44d463e2b21d6',
              'projectId': 'f5f4066bd75a4e22946d65e53eda8673',
              'replayType': '内容与重点',
              'projectStage': '完成阶段',
              'replayContent': '完成阶段1',
              'riskNum': '0',
              'completionStatus': null,
              'reason': '哈哈哈哈',
              'orderNo': null
            },
            {
              'inputUser': 1966477,
              'updateUser': 1966477,
              'inputStamp': '2023-09-25 10:51:50',
              'updateStamp': '2023-09-25 10:51:50',
              'replayDetailId': '01hb5mmm08j1f7m2b985pk4t0ybm82',
              'replayId': '8e358ae8c23a4e34b3f44d463e2b21d6',
              'projectId': 'f5f4066bd75a4e22946d65e53eda8673',
              'replayType': '内容与重点',
              'projectStage': '完成阶段',
              'replayContent': '完成阶段2',
              'riskNum': '0',
              'completionStatus': null,
              'reason': '哈哈哈哈',
              'orderNo': null
            },
            {
              'inputUser': 1966477,
              'updateUser': 1966477,
              'inputStamp': '2023-09-25 10:51:50',
              'updateStamp': '2023-09-25 10:51:50',
              'replayDetailId': '01hb5m1vv08j1f7la85pk4t0ybm82',
              'replayId': '8e358ae8c23a4e34b3f44d463e2b21d6',
              'projectId': 'f5f4066bd75a4e22946d65e53eda8673',
              'replayType': '内容与重点',
              'projectStage': '完成阶段',
              'replayContent': '完成阶段3',
              'riskNum': '0',
              'completionStatus': null,
              'reason': '哈哈哈哈',
              'orderNo': null
            },
            {
              'inputUser': 1966477,
              'updateUser': 1966477,
              'inputStamp': '2023-09-25 10:51:50',
              'updateStamp': '2023-09-25 10:51:50',
              'replayDetailId': '01qqm1vvz81f7la85pk4t0ybm82',
              'replayId': '8e358ae8c23a4e34b3f44d463e2b21d6',
              'projectId': 'f5f4066bd75a4e22946d65e53eda8673',
              'replayType': '内容与重点',
              'projectStage': '完成阶段',
              'replayContent': '完成阶段4',
              'riskNum': '0',
              'completionStatus': null,
              'reason': '哈哈哈哈',
              'orderNo': null
            },
            {
              'inputUser': 1966477,
              'updateUser': 1966477,
              'inputStamp': '2023-09-25 10:51:50',
              'updateStamp': '2023-09-25 10:51:50',
              'replayDetailId': '91gb51zf08j1f7m2bh74t0ybm82',
              'replayId': '8e358ae8c23a4e34b3f44d463e2b21d6',
              'projectId': 'f5f4066bd75a4e22946d65e53eda8673',
              'replayType': '内容与重点',
              'projectStage': '报告阶段',
              'replayContent': '报告阶段1',
              'riskNum': '0',
              'completionStatus': null,
              'reason': '哈哈哈哈',
              'orderNo': null
            },
            {
              'inputUser': 1966477,
              'updateUser': 1966477,
              'inputStamp': '2023-09-25 10:51:50',
              'updateStamp': '2023-09-25 10:51:50',
              'replayDetailId': '91g7z7zzf08j1f7m2bh74t0ybm82',
              'replayId': '8e358ae8c23a4e34b3f44d463e2b21d6',
              'projectId': 'f5f4066bd75a4e22946d65e53eda8673',
              'replayType': '内容与重点',
              'projectStage': '报告阶段',
              'replayContent': '报告阶段2',
              'riskNum': '0',
              'completionStatus': null,
              'reason': '哈哈哈哈',
              'orderNo': null
            },
            {
              'inputUser': 1966477,
              'updateUser': 1966477,
              'inputStamp': '2023-09-25 10:51:50',
              'updateStamp': '2023-09-25 10:51:50',
              'replayDetailId': '01hb5zf08j1f7m2b33hbm82',
              'replayId': '8e358ae8c23a4e34b3f44d463e2b21d6',
              'projectId': 'f5f4066bd75a4e22946d65e53eda8673',
              'replayType': '内容与重点',
              'projectStage': '立项阶段',
              'replayContent': '立项阶段1',
              'riskNum': '0',
              'completionStatus': null,
              'reason': '哈哈哈哈',
              'orderNo': null
            },
            {
              'inputUser': 1966477,
              'updateUser': 1966477,
              'inputStamp': '2023-09-25 10:51:50',
              'updateStamp': '2023-09-25 10:51:50',
              'replayDetailId': '01hb5zf6617m2bh74t0ybm82',
              'replayId': '8e358ae8c23a4e34b3f44d463e2b21d6',
              'projectId': 'f5f4066bd75a4e22946d65e53eda8673',
              'replayType': '内容与重点',
              'projectStage': '立项阶段',
              'replayContent': '立项阶段2',
              'riskNum': '0',
              'completionStatus': null,
              'reason': '哈哈哈哈',
              'orderNo': null
            },
            {
              'inputUser': 1966477,
              'updateUser': 1966477,
              'inputStamp': '2023-09-25 10:51:50',
              'updateStamp': '2023-09-25 10:51:50',
              'replayDetailId': '01hbzf66199w7m2bh74t0ybm82',
              'replayId': '8e358ae8c23a4e34b3f44d463e2b21d6',
              'projectId': 'f5f4066bd75a4e22946d65e53eda8673',
              'replayType': '内容与重点',
              'projectStage': '立项阶段',
              'replayContent': '立项阶段3',
              'riskNum': '0',
              'completionStatus': null,
              'reason': '哈哈哈哈',
              'orderNo': null
            },
            {
              'inputUser': 1966477,
              'updateUser': 1966477,
              'inputStamp': '2023-09-25 10:51:50',
              'updateStamp': '2023-09-25 10:51:50',
              'replayDetailId': '01hb5zf08rsbp5cknq8wpg546w',
              'replayId': '8e358ae8c23a4e34b3f44d463e2b21d6',
              'projectId': 'f5f4066bd75a4e22946d65e53eda8673',
              'replayType': '内容与重点',
              'projectStage': '分析阶段',
              'replayContent': '111',
              'riskNum': '11',
              'completionStatus': null,
              'reason': '11',
              'orderNo': null
            },
            {
              'inputUser': 1966477,
              'updateUser': 1966477,
              'inputStamp': '2023-09-25 10:51:50',
              'updateStamp': '2023-09-25 10:51:50',
              'replayDetailId': '01hb5zf0902b0d2cjz3hdwvrap',
              'replayId': '8e358ae8c23a4e34b3f44d463e2b21d6',
              'projectId': 'f5f4066bd75a4e22946d65e53eda8673',
              'replayType': '内容与重点',
              'projectStage': '分析阶段',
              'replayContent': '未形成疑点事项',
              'riskNum': '0',
              'completionStatus': null,
              'reason': '哈哈哈哈',
              'orderNo': null
            },
            {
              'inputUser': 1966477,
              'updateUser': 1966477,
              'inputStamp': '2023-09-25 10:51:50',
              'updateStamp': '2023-09-25 10:51:50',
              'replayDetailId': '01hb5zf099412b0d2cjz3hdwvrap',
              'replayId': '8e358ae8c23a4e34b3f44d463e2b21d6',
              'projectId': 'f5f4066bd75a4e22946d65e53eda8673',
              'replayType': '内容与重点',
              'projectStage': '整改阶段',
              'replayContent': '整改阶段1',
              'riskNum': '0',
              'completionStatus': null,
              'reason': '哈哈哈哈',
              'orderNo': null
            },
            {
              'inputUser': 1966477,
              'updateUser': 1966477,
              'inputStamp': '2023-09-25 10:51:50',
              'updateStamp': '2023-09-25 10:51:50',
              'replayDetailId': 'b5445640902b0d2cjz3hdwvrap',
              'replayId': '8e358ae8c23a4e34b3f44d463e2b21d6',
              'projectId': 'f5f4066bd75a4e22946d65e53eda8673',
              'replayType': '内容与重点',
              'projectStage': '整改阶段',
              'replayContent': '整改阶段2',
              'riskNum': '0',
              'completionStatus': null,
              'reason': '哈哈哈哈',
              'orderNo': null
            },
            {
              'inputUser': 1966477,
              'updateUser': 1966477,
              'inputStamp': '2023-09-25 10:51:50',
              'updateStamp': '2023-09-25 10:51:50',
              'replayDetailId': 'b54sada640902b0d2cjz3hdwvrap',
              'replayId': '8e358ae8c23a4e34b3f44d463e2b21d6',
              'projectId': 'f5f4066bd75a4e22946d65e53eda8673',
              'replayType': '内容与重点',
              'projectStage': '整改阶段',
              'replayContent': '整改阶段3',
              'riskNum': '0',
              'completionStatus': null,
              'reason': '哈哈哈哈',
              'orderNo': null
            },
            {
              'inputUser': 1966477,
              'updateUser': 1966477,
              'inputStamp': '2023-09-25 10:51:50',
              'updateStamp': '2023-09-25 10:51:50',
              'replayDetailId': '01hb5zf096fgmwhe5x6wbwdczx',
              'replayId': '8e358ae8c23a4e34b3f44d463e2b21d6',
              'projectId': 'f5f4066bd75a4e22946d65e53eda8673',
              'replayType': '内容与重点',
              'projectStage': '分析阶段',
              'replayContent': '111',
              'riskNum': '11',
              'completionStatus': null,
              'reason': '11',
              'orderNo': null
            },
            {
              'inputUser': 1966477,
              'updateUser': 1966477,
              'inputStamp': '2023-09-25 10:51:50',
              'updateStamp': '2023-09-25 10:51:50',
              'replayDetailId': '01hb5zf09b9wrszb1svjpy7z5p',
              'replayId': '8e358ae8c23a4e34b3f44d463e2b21d6',
              'projectId': 'f5f4066bd75a4e22946d65e53eda8673',
              'replayType': '内容与重点',
              'projectStage': '实施阶段',
              'replayContent': '未形成测试记录事项',
              'riskNum': '0',
              'completionStatus': null,
              'reason': null,
              'orderNo': null
            },
            {
              'inputUser': 1966477,
              'updateUser': 1966477,
              'inputStamp': '2023-09-25 10:51:50',
              'updateStamp': '2023-09-25 10:51:50',
              'replayDetailId': '01hb5zf09gmakrwv9eevvbz4xk',
              'replayId': '8e358ae8c23a4e34b3f44d463e2b21d6',
              'projectId': 'f5f4066bd75a4e22946d65e53eda8673',
              'replayType': '内容与重点',
              'projectStage': '实施阶段',
              'replayContent': '11',
              'riskNum': '111',
              'completionStatus': null,
              'reason': '11',
              'orderNo': null
            },
            {
              'inputUser': 1966477,
              'updateUser': 1966477,
              'inputStamp': '2023-09-25 10:51:50',
              'updateStamp': '2023-09-25 10:51:50',
              'replayDetailId': '01hb5zf09nx1kcjy6x7645eeng',
              'replayId': '8e358ae8c23a4e34b3f44d463e2b21d6',
              'projectId': 'f5f4066bd75a4e22946d65e53eda8673',
              'replayType': '内容与重点',
              'projectStage': '实施阶段',
              'replayContent': '未形成工作底稿事项',
              'riskNum': '0',
              'completionStatus': null,
              'reason': null,
              'orderNo': null
            },
            {
              'inputUser': 1966477,
              'updateUser': 1966477,
              'inputStamp': '2023-09-25 10:51:50',
              'updateStamp': '2023-09-25 10:51:50',
              'replayDetailId': '01hb5zf09sqjr5kwqzz741mr2f',
              'replayId': '8e358ae8c23a4e34b3f44d463e2b21d6',
              'projectId': 'f5f4066bd75a4e22946d65e53eda8673',
              'replayType': '内容与重点',
              'projectStage': '实施阶段',
              'replayContent': '未在方案但出具底稿的事项',
              'riskNum': '2',
              'completionStatus': null,
              'reason': null,
              'orderNo': null
            },
            {
              'inputUser': 1966477,
              'updateUser': 1966477,
              'inputStamp': '2023-09-25 10:51:50',
              'updateStamp': '2023-09-25 10:51:50',
              'replayDetailId': '01hb5zf09yesr94ntw99avn41q',
              'replayId': '8e358ae8c23a4e34b3f44d463e2b21d6',
              'projectId': 'f5f4066bd75a4e22946d65e53eda8673',
              'replayType': '内容与重点',
              'projectStage': '实施阶段',
              'replayContent': '未关注的重要线索及重点领域',
              'riskNum': null,
              'completionStatus': null,
              'reason': null,
              'orderNo': null
            },
            {
              'inputUser': 1966477,
              'updateUser': 1966477,
              'inputStamp': '2023-09-25 10:51:50',
              'updateStamp': '2023-09-25 10:51:50',
              'replayDetailId': '01hb5zf0a4amdcr9tcmt4hf0bz',
              'replayId': '8e358ae8c23a4e34b3f44d463e2b21d6',
              'projectId': 'f5f4066bd75a4e22946d65e53eda8673',
              'replayType': '内容与重点',
              'projectStage': '实施阶段',
              'replayContent': '未形成测试记录事项',
              'riskNum': '0',
              'completionStatus': null,
              'reason': null,
              'orderNo': null
            },
            {
              'inputUser': 1966477,
              'updateUser': 1966477,
              'inputStamp': '2023-09-25 10:51:50',
              'updateStamp': '2023-09-25 10:51:50',
              'replayDetailId': '01hb5zf0a9m3ffefecf2pt9zn1',
              'replayId': '8e358ae8c23a4e34b3f44d463e2b21d6',
              'projectId': 'f5f4066bd75a4e22946d65e53eda8673',
              'replayType': '内容与重点',
              'projectStage': '实施阶段',
              'replayContent': '11',
              'riskNum': '111',
              'completionStatus': null,
              'reason': '11',
              'orderNo': null
            },
            {
              'inputUser': 1966477,
              'updateUser': 1966477,
              'inputStamp': '2023-09-25 10:51:50',
              'updateStamp': '2023-09-25 10:51:50',
              'replayDetailId': '01hb5zf0afhm4z0vqzktjahwjp',
              'replayId': '8e358ae8c23a4e34b3f44d463e2b21d6',
              'projectId': 'f5f4066bd75a4e22946d65e53eda8673',
              'replayType': '内容与重点',
              'projectStage': '实施阶段',
              'replayContent': '未形成工作底稿事项',
              'riskNum': '0',
              'completionStatus': null,
              'reason': null,
              'orderNo': null
            },
            {
              'inputUser': 1966477,
              'updateUser': 1966477,
              'inputStamp': '2023-09-25 10:51:50',
              'updateStamp': '2023-09-25 10:51:50',
              'replayDetailId': '01hb5zf0aqsmyr1dkxjrhytnah',
              'replayId': '8e358ae8c23a4e34b3f44d463e2b21d6',
              'projectId': 'f5f4066bd75a4e22946d65e53eda8673',
              'replayType': '内容与重点',
              'projectStage': '实施阶段',
              'replayContent': '未在方案但出具底稿的事项',
              'riskNum': '2',
              'completionStatus': null,
              'reason': null,
              'orderNo': null
            }
          ]

          /*          // 检查该类型是否已经在统计对象中，如果不在则初始化为1，如果已经在则加1
                    for (const item of this.tableData) {
                      const stage = item.projectStage
                      this.stageCount[stage] = this.stageCount[stage] ? this.stageCount[stage] + 1 : 1
                    }

                    console.log(this.stageCount, 'count')*/

          this.tableData.sort((a, b) => {
            return a.projectStage.localeCompare(b.projectStage)
          })

          this.rowIndexArr = [0]
          for (let i = 1; i < this.tableData.length; i++) {
            if (this.tableData[i].projectStage !== this.tableData[i - 1].projectStage) {
              this.rowIndexArr.push(i)
            }
          }
          this.rowIndexArr.push(this.tableData.length)
          // 如果state为1的话 就不可编辑保存
    },
    delete_fn(index) {
      // const index = this.tableData.findIndex(row => row.replayDetailId === rowId)
      // if (index !== -1) {
      //   this.tableData.splice(index, 1) // 使用splice删除选定的行
      //   // 重新计算合并信息
      //   this.getSpanData(this.tableData)
      // }
      this.tableData.splice(index, 1)
      this.tableData.sort((a, b) => {
            return a.projectStage.localeCompare(b.projectStage)
          })

          this.rowIndexArr = [0]
          for (let i = 1; i < this.tableData.length; i++) {
            if (this.tableData[i].projectStage !== this.tableData[i - 1].projectStage) {
              this.rowIndexArr.push(i)
            }
          }
          this.rowIndexArr.push(this.tableData.length)
    },

    //设置单元格
    getSpanData(data) {
      this.spanData = []
      this.columnArr.forEach((element) => {
        let contactDot = 0
        this.spanArr = []
        data.forEach((item, index) => {
          if (index === 0) {
            this.spanArr.push(1)
          } else {
            if (item[element] === data[index - 1][element]) {
              this.spanArr[contactDot] += 1
              this.spanArr.push(0)
            } else {
              contactDot = index
              this.spanArr.push(1)
            }
          }
        })
        this.spanData.push(this.spanArr)
      })
    },

    //合并单元格
    objectSpanMethod({ row, column, rowIndex, columnIndex }) {
      console.log(row, column,);
      if (columnIndex === 0) {
        // 此时rowIndexArr存储了所有合并开始的点的索引，两个索引的差值，就是合并的项数
        if (this.rowIndexArr.includes(rowIndex)) {
          return {
            rowspan: this.rowIndexArr[this.rowIndexArr.indexOf(rowIndex) + 1] - rowIndex,
            colspan: 1
          }
        } else {
          return {
            rowspan: 0,
            colspan: 0
          }
        }
      }
    },

    generateUuid() {
      return 'xxxxxxxxxxxx4xxxyxxxxxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
        const r = Math.random() * 16 | 0
        const v = c === 'x' ? r : (r & 0x3 | 0x8)
        return v.toString(16)
      })
    },
    add(row) {
      const index = this.tableData.indexOf(row)
      if (index !== -1) {
        const newRow = {
          replayDetailId: this.generateUuid(),
          replayType: '内容与重点',
          projectId: this.projectId,
          projectStage: row.projectStage, // 使用点击的行的 projectStage
          replayContent: '',
          riskNum: '',
          reason: '',
          rowspan: 1
        }
        console.log(newRow,'newRow')
        this.tableData.splice(index + 1, 0, newRow) // 插入到当前行的前面
        this.replayContentInputFlag = true
        // 更新合并单元格的行数
        // this.getSpanData(this.tableData)
      }
    },
    save_fn() {
      console.log(this.tableData)
      // let params = {
      //   projectReplayDetailModel: this.tableData,
      //   replayId: this.replayId,
      //   projectId: this.projectId,
      //   replayType: '内容与重点'
      // }
      // save(params).then((res) => {
      //   if (res.code == 200) {
      //     this.$message.success('保存成功!')
      //     this.getList()
      //   } else {
      //     this.$message.error(res.msg)
      //   }
      // })
    },
    // 确认
    confirm_fn() {
      this.$confirm(`是否确认？确认后不允许修改`, '提示', {
        cancelButtonText: '取消',
        confirmButtonText: '确定',
        type: 'warning'
      })
        .then((confirm) => {
          if (confirm) {
            // 点击确认 先调保存接口
            this.save_fn()

            // let params = {
            //   replayId: this.replayId,
            //   projectId: this.projectId,
            //   replayType: '内容与重点'
            // }
            // submit(params).then((rsp) => {
            //   const { code } = rsp
            //   if (code === '200') {
            //     this.getList()
            //     // 点击完确认后  页面的保存确认删除添加按钮隐藏  只展示表格
            //     this.clearBtn = true
            //   }
            // })
          }
        })
        .catch(() => {
        })
    }

  }
}
</script>

<style scoped>
.header-btn {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 10px;
}
</style>
